{% extends 'base.html' %}
{% load static %}

{% block title %}{{ page_title }} - 本地有约{% endblock %}

{% block content %}
<div class="container py-4">
    <div class="row justify-content-center">
        <div class="col-lg-8">
            <div class="card border-0 shadow">
                <div class="card-header bg-primary text-white">
                    <h4 class="mb-0"><i class="fas fa-edit me-2"></i>编辑帖子</h4>
                </div>
                <div class="card-body p-4">
                    <form id="editPostForm" method="POST" action="{% url 'location:edit_post' post.id %}">
                        {% csrf_token %}
                        
                        <!-- 帖子标题 -->
                        <div class="mb-4">
                            <label for="postTitle" class="form-label fw-bold">帖子标题</label>
                            <input type="text" class="form-control form-control-lg" id="postTitle" name="title"
                                   value="{{ post.title }}" required maxlength="200">
                        </div>

                        <!-- 帖子类型和活动 -->
                        <div class="row mb-4">
                            <div class="col-md-6">
                                <label for="postType" class="form-label fw-bold">帖子类型</label>
                                <select class="form-select" id="postType" name="post_type">
                                    <option value="discussion" {% if post.post_type == 'discussion' %}selected{% endif %}>💬 讨论</option>
                                    <option value="experience" {% if post.post_type == 'experience' %}selected{% endif %}>📚 经验分享</option>
                                    <option value="question" {% if post.post_type == 'question' %}selected{% endif %}>❓ 提问</option>
                                    <option value="announcement" {% if post.post_type == 'announcement' %}selected{% endif %}>📢 公告</option>
                                </select>
                            </div>
                            <div class="col-md-6">
                                <label for="postEvent" class="form-label fw-bold">关联活动（可选）</label>
                                <select class="form-select" id="postEvent" name="event_id">
                                    <option value="">不关联活动</option>
                                    {% for event in events %}
                                    <option value="{{ event.id }}" {% if post.event.id == event.id %}selected{% endif %}>{{ event.title }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>

                        <!-- 帖子内容 -->
                        <div class="mb-4">
                            <label for="postContent" class="form-label fw-bold">帖子内容</label>
                            <textarea class="form-control" id="postContent" name="content"
                                      rows="15" required>{{ post.content }}</textarea>
                        </div>

                        <div class="d-flex justify-content-between">
                            <a href="{% url 'location:post_detail' post.id %}" class="btn btn-secondary">
                                <i class="fas fa-arrow-left me-2"></i>取消
                            </a>
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save me-2"></i>保存修改
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
document.getElementById('editPostForm').addEventListener('submit', async function(e) {
    e.preventDefault();
    
    const submitBtn = this.querySelector('button[type="submit"]');
    const originalText = submitBtn.innerHTML;
    
    // 显示加载状态
    submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>保存中...';
    submitBtn.disabled = true;
    
    const formData = new FormData(this);
    
    try {
        const response = await fetch(this.action, {
            method: 'POST',
            body: formData,
            headers: {
                'X-Requested-With': 'XMLHttpRequest'
            }
        });
        
        const result = await response.json();
        
        if (result.status === 'success') {
            alert('帖子更新成功！');
            window.location.href = "{% url 'location:post_detail' post.id %}";
        } else {
            alert('更新失败：' + result.message);
            submitBtn.innerHTML = originalText;
            submitBtn.disabled = false;
        }
    } catch (error) {
        alert('更新失败：网络错误');
        submitBtn.innerHTML = originalText;
        submitBtn.disabled = false;
        console.error('Error:', error);
    }
});
</script>
{% endblock %}